<template>
  <div style="width: 100%;height:calc(100% - 50px);position: relative">
    <div class="filter-container">
      <div class="right-block">
        <el-select v-model="systemName" :clearable="true" size="small" class="theme-select" @change="reQueryList">
          <el-option v-for="(item, index) in $ACCOUNT_SYSTEM_LIST" :key="index" :label="item.label" :value="item.label"/>
        </el-select>
        <el-input v-model="search" style="width: 200px;margin-right: 10px" suffix-icon="el-icon-search" size="small" placeholder="输入编码或名称" @change="reQueryList"/>
        <el-button type="primary" size="small" @click="openUploadDialog">导入</el-button>
        <el-button type="primary" size="small" @click="exportHandler">导出</el-button>
        <el-button type="primary" size="small" @click="addHandler">新增</el-button>
        <el-button type="primary" size="small" @click="editHandler">修改</el-button>
        <el-button type="primary" size="small" @click="deleteHandler">删除</el-button>
        <el-button type="primary" size="small" @click="clearHandler">清空</el-button>
      </div>
    </div>
    <el-table
      ref="multipleTable"
      :border="true"
      :data="tableData"
      :header-cell-style="{textAlign: 'center'}"
      :cell-style="{textAlign: 'center'}"
      tooltip-effect="dark"
      style="width: 100%"
      @selection-change="handleSelectionChange">
      <el-table-column
        type="selection"
        width="55"/>
      <el-table-column
        prop="encode"
        label="编码"/>
      <el-table-column
        prop="name"
        label="名称"/>
      <el-table-column
        prop="parentEncode"
        label="上级科目"/>
      <el-table-column
        prop="subType"
        label="科目类别"/>
      <el-table-column
        label="余额方向">
        <template slot-scope="scope">
          <span>{{ $formatBalanceType(scope.row.balanceType) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        label="启用辅助核算">
        <template slot-scope="scope">
          <span>{{ $formatSubjectCheck(scope.row.assistCheck) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="commonAssistName"
        label="辅助核算"/>
      <el-table-column
        label="启用数量核算">
        <template slot-scope="scope">
          <span>{{ $formatSubjectCheck(scope.row.amountCheck) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="unit"
        label="计量单位"/>
      <el-table-column
        label="启用数量核算">
        <template slot-scope="scope">
          <span>{{ $formatSubjectCheck(scope.row.foreignCheck) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="forListName"
        label="外币核算"/>
      <el-table-column
        label="科目特征">
        <template slot-scope="scope">
          <span>{{ $formatSubjectFeature(scope.row.feature) }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="controSystem"
        label="受控系统"/>>
    </el-table>
    <upload-dialog ref="uploadDialog" @ok="uploadDialogOk"/>
    <add ref="add" @ok="addOk"/>
  </div>
</template>

<script>
import Pagination from '@/components/Pagination'
import UploadDialog from './uploadDialog'
import Add from './add'
function createForm(tar) {
  let raw = {
    encode: '',
    value: '',
    attrValue: '',
    phid: '',
    dataId: '',
    other: '1'
  }
  if (tar) {
    raw = Object.assign(raw, tar)
  }
  return raw
}
export default {
  name: 'Subject',
  components: {
    Pagination,
    UploadDialog,
    Add
  },
  data() {
    return {
      systemName: '',
      search: '',
      dialogVisible: false,
      dialogType: 'add',
      form: createForm(),
      rules: {
        encode: [
          { required: true, message: '必填', trigger: 'blur', max: 50 }
        ],
        value: [
          { required: true, message: '必填', trigger: 'blur', max: 50 }
        ],
        attrValue: [
          { trigger: 'blur', max: 10 }
        ]
      },
      tableData: [],
      current: 1,
      size: 10,
      total: 0,
      multipleSelection: []
    }
  },
  computed: {
  },
  created() {
    this.queryList()
  },
  methods: {
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    reQueryList() {
      this.current = 1
      this.queryList()
    },
    queryList() {
      this.$http.post('account/subTmp/list', {
        'current': this.current,
        'systemName': this.systemName,
        'condition': this.search,
        'size': 100
      }).then((res) => {
        const data = res.data || []
        this.tableData = data
      })
    },
    editHandler() {
      if (this.multipleSelection.length !== 1) {
        this.$message({
          type: 'info',
          message: '请选择一项'
        })
        return false
      } else {
        this.$refs.add.open(this.multipleSelection[0])
      }
    },
    deleteHandler() {
      if (this.multipleSelection.length !== 1) {
        this.$message({
          type: 'info',
          message: '请选择一项'
        })
        return false
      } else {
        this.$confirm('一旦删除，将不可恢复，是否确定删除?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning',
          showClose: false
        }).then(() => {
          this.$http.post(`account/subTmp/delete/${this.multipleSelection.phid}`).then(() => {
            this.$message({
              type: 'success',
              message: '操作成功'
            })
            this.reQueryList()
          })
        })
      }
    },
    exportHandler() {
      this.$http.post('account/subTmp/exportSubTmpAndData', {
        'current': this.current,
        'systemName': this.systemName,
        'condition': this.search,
        'size': 100
      }, { responseType: 'arraybuffer' }).then((res) => {
        this.$downloadExcel(res, '科目模板列表', 'xls')
      })
    },
    clearHandler() {
      this.$http.post(`account/subTmp/deleteByAccountsSystem/${this.systemName}`).then((res) => {
        this.reQueryList()
      })
    },
    uploadDialogOk() {
      this.reQueryList()
    },
    openUploadDialog() {
      this.$refs.uploadDialog.open()
    },
    addHandler() {
      this.$refs.add.open()
    },
    addOk() {
      this.reQueryList()
    }
  }
}
</script>

<style rel="stylesheet/scss" lang="scss" scoped>
</style>
